<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=8" />
    <title>电话列表</title>
    <jsp:include page="/commons/common-js.jsp"></jsp:include>
    <script src="/js/uploadify/jquery.ui.widget.js"></script>
	<script src="/js/uploadify/jquery.iframe-transport.js"></script>
	<script src="/js/uploadify/jquery.fileupload.js"></script>
    
    
    <!-- 电话插件 -->
    <!-- C9E29294-7FB3-4221-BB36-B91462C32746 -->
    <!-- <object classid="clsid:C4751F74-C039-4272-8532-11F7ACBAD184" id="JDComPort1"
          name="JDComPort1"  
          Width="0"   
          height="0">
	</object> -->
</head>
<body>
<object classid="clsid:C4751F74-C039-4272-8532-11F7ACBAD184" id="JDComPort1"
          name="JDComPort1"  
          Width="0"   
          height="0">
    <PARAM NAME="_ExtentX" VALUE="953">
    <PARAM NAME="_ExtentY" VALUE="953">
</object>
<div style="width: 100%;overflow:auto;margin-top: 10px;" id="tablediv">
    <div style="margin:0 auto; width:97%; float:none; display:block;">
        <table id="adminList" class="easyui-datagrid" title="电话列表" height="auto" style="width:100%;overflow:hidden;"
               data-options="singleSelect:false,collapsible:true,pagination:true,flt:true,pageSize:20,toolbar:toolbar,
				loadMsg:'加载中...',url:'${pageContext.request.contextPath}/phone/list'">
            <thead>
            <tr>
            	<!-- <th data-options="field:'ck',checkbox:true"></th> -->
                <th data-options="field:'remark',align:'center',hidden:true">备注</th> 
                <th data-options="field:'jobNum',align:'center',width:'20%',formatter:formatFontsize">工号</th>
                <th data-options="field:'name',align:'center',width:'20%',formatter:formatFontsize">姓名</th>
                <th data-options="field:'phone',align:'center',width:'20%',formatter:formatFontsize">电话</th>
                <th data-options="field:'createTime',align:'center',width:'20%',formatter:TAOTAO.formatDateTime">创建时间</th>
                <th data-options="field:'id',width:'20%',align:'center',formatter:formatOper">操作</th>
            </tr>
            </thead>
        </table>
    </div>
    <div id="remarkWindow" class="easyui-window" title="备注" data-options="modal:true,closed:true,iconCls:'icon-save'" style="width:40%;height:40%;padding:10px;">
	<form id="remarkForm" class="remarkForm" method="post">
		<input type="hidden" name="id" id="id"/>
		电话号码:
		<input class="easyui-textbox" type="text" id="phone" name="phone" style="width: 280px;" disabled></input>
		<div></div>
	    <textarea id="remark" name="remark" cols="80" rows="10"></textarea>
	</form>
	<div style="padding:5px">
	    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitRemarkForm()">提交</a>
	    &nbsp;&nbsp;&nbsp;
	    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()">重置</a>
	</div>
</div>
   		<div style="width: 100%;overflow:auto;margin-top: 10px;margin-left: 25px;"><strong>消息窗口</strong><br>   
        <textarea id="mbox" name="mbox" cols="80" rows="10">   
        </textarea>
        </div>
<form id="upload_form" action="${pageContext.request.contextPath}/phone/upload" method="post" enctype="multipart/form-data" name="upload_form">
	  <!-- <label>选择图片文件</label> -->
	 <input id="file" name="file" type="file"/>
  	 <input id="upload" name="upload" type="submit" value="上传"/>
</form>
<script type="text/javascript">
//隐藏文件上传的input表
$("#file").hide();
$("#upload").hide();
//判断登陆类型
if(!window.ActiveXObject){
alert("对不起，证书登陆请使用IE浏览器！");
//return false;
}
/* function getSelectionsIds(){
	var itemList = $("#adminList");
	var sels = itemList.datagrid("getSelections");
	var ids = [];
	for(var i in sels){
		ids.push(sels[i].id);
	}
	ids = ids.join(",");
	return ids;
} */

function formatOper(val,row,index){
	//alert(val+":"+row.remark+":"+index);
	
		return '<a href="javascript:void(0)" style="font-size:15px"'+ 
		'onclick="dial('+row.phone+')">拨打</a>&nbsp;&nbsp;&nbsp;&nbsp;' + '<a href="javascript:void(0)" style="font-size:15px"'+
		'onclick="remark('+val+')">备注</a>&nbsp;&nbsp;&nbsp;&nbsp;' +
		'<a href="javascript:void(0)" style="font-size:15px"'+
		'onclick="sign('+val+')">标记已播</a>' ;
		
}
function formatFontsize(value,row,index){
	if(value != null){
		return '<span style="font-size:15px">'+value+'</span>';
	}
    
}

/* $(function(){
     $('#file').fileupload({
        url:'${pageContext.request.contextPath}/phone/upload',
        autoUpload:true,
        sequentialUploads: true,
        //上传失败
        fail: function(e, data) {
            data.context.find('.error').text('上传失败');
        },
        //上传完成
        done : function(e, data) {
        }
    });
}) */

function uploadFile(obj, type) {
	alert("111");
	var fileName = $("#upload_form").find("input[name=file]").val();
	alert("fileName:"+fileName);
	if (fileName === '') {
        //alert('请选择文件');
        return;
    }
	var fileType = (fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length)).toLowerCase();
    if (fileType !== 'wav') {
        alert('文件格式不正确，.wav文件！');
        return;
    }
    //alert($('#file')[0].files[0]);
    var formData = new FormData();
	formData.append("file",$('#file')[0].files[0]);
	formData.append("type",1);
	$.ajax({
        type: 'POST',
        url: "${pageContext.request.contextPath}/phone/upload",
        data: formData,
        dataType: "JSON",
        mimeType: "multipart/form-data",
        contentType: false,
        cache: false,
        processData: false,
        error : function(XHR, textStatus, errorThrown) {
            alert("网络错误！XHR=" + XHR + "\ntextStatus=" + textStatus
                    + "\nerrorThrown=" + errorThrown);
        },
        success : function(data) {
            alert(data.msg);
        }
    });
    /* $.ajaxFileUpload({  
        url : "${pageContext.request.contextPath}/phone/upload",  
        secureuri : false,// 一般设置为false  
        fileElementId : "file",// 文件上传表单的id <input type="file" id="fileUpload" name="file" />  
        dataType : 'json',// 返回值类型 一般设置为json  
        data: {'type': type},  
        success : function(data) // 服务器成功响应处理函数  
        {  
                },  
        error : function(data)// 服务器响应失败处理函数  
        {  
            console.log("服务器异常");  
        }  
    });   */
    //return false; 
}  

/* 拨打电话 */
function dial(val){
	alert(val);
	JDComPort1.DialupChanl(val,0);
	//强制开始录音
	//JDComPort1.StartWaveIn(0,"");
}
/* 标记已播 */
function sign(val){

	$.ajax({
		   type: "POST",
		   url: "${pageContext.request.contextPath}/phone/updateRemark",
		   data: {id:val,status:1},
		   success: function(data){
			   if(data.status == '000'){
				   $.messager.alert('提示','标记已播成功!','info',function(){
						$("#adminList").datagrid("reload");
					    //clearForm();
					});
				}else if(data.status == '001'){
					$.messager.alert('系统提示','标记异常');
					
				}else if(data.status == '002'){
					$.messager.alert('系统提示','标记异常');
				}
			   
		   },
		   error: function(){
			   $.messager.alert('提示','标记已播失败!');
		   }
		});
}
/* 备注  */
function remark(val){
	//$.messager.alert('提示','备注');
	//alert(val+":"+row.phone+":"+row.remark);
	$('#remarkWindow').window('open');
	var url = '${pageContext.request.contextPath}/phone/selectById?id='+val;
	/* alert(url);
	$("#id").val(url.id);
	$("#phone").val(url.phone);
	$("#remark").val(url.remark); */
	$('#remarkForm').form('load',url);
}
/* 备注提交 */
function submitRemarkForm(){
	//校验
	/* if(!$('#remarkForm').form('validate')){
		$.messager.alert('提示','表单还未填写完成!');
		return ;
	} */
	$.ajax({
		   type: "POST",
		   url: "${pageContext.request.contextPath}/phone/updateRemark",
		   data: $("#remarkForm").serialize(),
		   success: function(data){
			   if(data.status == '000'){
				   $.messager.alert('提示','备注成功!','info',function(){
						$("#remarkWindow").window('close');
						$("#adminList").datagrid("reload");
					    //clearForm();
					});
				}else if(data.status == '001'){
					$.messager.alert('系统提示',data.msg);
					
				}else if(data.status == '002'){
					$.messager.alert('系统提示',data.msg);
				}
			   
		   },
		   error: function(){
			   $.messager.alert('提示','备注失败!');
		   }
		});
	
}

function openFile(){
	return $("#file").click();
}
function uploadClick(){
	return $("#upload").click();
}
$(function(){
	$('#upload_form').submit(function(event){
		event.preventDefault();
		var fileName = $("#upload_form").find("input[name=file]").val();
    	if (fileName === '') {
            alert('您未选择录音文件上传!');
            return;
        }
    	var fileType = (fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length)).toLowerCase();
        if (fileType !== 'wav') {
            alert('文件格式不正确，需要.wav文件！');
            return;
        }
        var form = $(this);
        // mulitipart form,如文件上传类
        var formData = new FormData(this);
    	$.ajax({
            type: 'POST',
            url: "${pageContext.request.contextPath}/phone/upload",
            data: formData,
            dataType: "JSON",
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            processData: false,
            error : function(XHR, textStatus, errorThrown) {
                alert("网络错误！XHR=" + XHR + "\ntextStatus=" + textStatus
                        + "\nerrorThrown=" + errorThrown);
            },
            success : function(data) {
                alert(data.msg);
            }
        });
        
    	});
})
/* 重置 */
function clearForm(){
	$("#remark").val("");
}
var toolbar = [{
    text:'打开设备',
    iconCls:'icon-ok',
    handler:function(){
    	Open();
    	$.messager.alert('提示','Open ceshi!');
    }
},{
    text:'关闭设备',
    iconCls:'icon-cancel',
    handler:function(){
    	Close();
    	$.messager.alert('提示','Close ceshi!');
    }
},{
    text:'查找设备',
    iconCls:'icon-search',
    handler:function(){
    	var result = SetupPorts(); 
    	alert(result);
    	/* if(result == '' || result.length == 0){
    		$.messager.alert('提示','未找到设备!');
        	}else{
    		$.messager.alert('提示','设备已连接!');
            	} */
    }
},{
    text:'系统设置',
    iconCls:'icon-add',
    handler:function(){
    	SetState();
    	//$.messager.alert('提示','系统初始化设置完成!');
    }
},{
    text:'清除显示',
    iconCls:'icon-reload',
    handler:function(){
    	$("#mbox").val("");
		/* var fileName = $("#upload_form").find("input[name=file]").val();
    	alert("fileName:"+fileName);
    	if (fileName === '') {
            //alert('请选择文件');
            return;
        }
    	var fileType = (fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length)).toLowerCase();
        if (fileType !== 'wav') {
            alert('文件格式不正确，.wav文件！');
            return;
        } */
        /* alert($('#file')[0].files[0]);
        var formData = new FormData();
    	formData.append("file",$('#file')[0].files[0]);
    	$.ajax({
            type: 'POST',
            url: "${pageContext.request.contextPath}/phone/upload",
            data: formData,
            dataType: "JSON",
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            processData: false,
            error : function(XHR, textStatus, errorThrown) {
                alert("网络错误！XHR=" + XHR + "\ntextStatus=" + textStatus
                        + "\nerrorThrown=" + errorThrown);
            },
            success : function(data) {
                alert(data.msg);
            }
        }); */
    	//获取音频文件测试
    	/* var fso = new ActiveXObject("Scripting.FileSystemObject");
    	var f1 = fso.GetFile("E:\\REC001.wav");
    	alert(fso.GetFile("E:\\REC001.wav"));
    	alert("File last modified: " + f1.DateLastModified); */

    	 /* var reader = new FileReader();
         reader.readAsDataURL(f1);
         reader.onload = function () {
             console.log(reader.result);
             alert(reader.result);
         }; */
		//alert(f1.getBytes());
    	/* var f = fso.OpenTextFile(f1.value,1); 
    	alert(f);
    	var txt=f.ReadAll(); 
    	alert(txt); */
    	//将文件赋值给input,并提交form表单
    	//$("#file").val(f1);
    	//提交form表单
    	//$("#upload_form").submit();
    	/* window.clipboardData.setData('text',"E:\\REC001.wav");   
	    var WshShell = new ActiveXObject("WScript.Shell");    
	    $("#file").focus();  
	    WshShell.sendKeys("E:\\REC001.wav"); */  
	    //WshShell.sendKeys("^v");
    	
    	/* var WshShell=new ActiveXObject("WScript.Shell");
    	setTimeout('$("#file").focus();WshShell.sendKeys("E:\\REC001.wav");',0); */  
    	//$("#upload_form").submit();
    	/* var formData = new FormData();
    	formData.append("file",f1);
    	formData.append("name","E:\\REC001.wav");
    	var fileName = $("#upload_form").find("input[name=file]").val();
    	alert("fileName:"+fileName);
    	if (fileName === '') {
            alert('请选择文件');
        }
    	$.ajax({
            type: 'POST',
            url: "${pageContext.request.contextPath}/phone/upload",
            data: formData,
            dataType: "JSON",
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            processData: false,
            error : function(XHR, textStatus, errorThrown) {
                alert("网络错误！XHR=" + XHR + "\ntextStatus=" + textStatus
                        + "\nerrorThrown=" + errorThrown);
            },
            success : function(data) {
                alert(data.msg);
                //alert(data.url);
                //$("#image").val(data.url);
                //$("#imgfile").after("<a href='"+data.url+"' target='_blank'><img src='"+data.url+"' width='120' height='80'/></a>");
            }
        }); */
    	
    	
    }
}
    ];

function Open()   
{   
  JDComPort1.Open(); 
}
function Close()   
{   
  JDComPort1.Close();   
}   
function SetState()   
{   
  JDComPort1.SetSate();   
}
function SetupPorts()   
{   
	JDComPort1.SetupPorts();
}
function AddInfo(sInf)   
{   
$("#mbox").val("\r" +sInf + $("#mbox").val());  
}
//事件与消息   
//按键事件   
function OnKeyPress(key,devid)   
	{   
	  //document.getElementById("Key_Dev").value =devid+ ":"+key;
	  var word;
	  switch(key){
	  case "T":word = "摘机";break;
	  case "H":word = "挂机";break;
	  default : word = "响铃中";
	  }   
	  AddInfo(devid+":"+ word);
	  //只要是挂机就执行上传录音
	  if(key == 'H'){
		openFile();
	    uploadClick();
	}   
}
//来电事件   
function OnRead(s,t,devid,wavefile)   
	{   
	  //document.getElementById("CallerID").value =devid+ ":"+ s +"   "+  wavefile;   
	  AddInfo(devid+ ":"+ s +"   "+  wavefile);
	  //上传录音文件
	  var path = WavePath() + wavefile;
	  //根据电话,存储来电或录音时间及录音文件名
	  $.ajax({
		   type: "POST",
		   url: "${pageContext.request.contextPath}/phone/updateRecordFile",
		   data: {devid:devid,phone:s,recordFile:wavefile},
		   success: function(data){
			   /* if(data.status == '000'){
				   $.messager.alert('提示','标记已播成功!','info',function(){
						//$("#remarkWindow").window('close');
						$("#adminList").datagrid("reload");
					    //clearForm();
					});
				}else if(data.status == '001'){
					$.messager.alert('系统提示','标记异常');
					
				}else if(data.status == '002'){
					$.messager.alert('系统提示','标记异常');
				} */
			   
		   },
		   error: function(){
			   //$.messager.alert('提示','标记已播失败!');
		   }
		});
	    
	}     

function OnOpen()   
	{   
	  AddInfo("Open:打开设备"); 
	}   
function OnClose()   
	{   
	  AddInfo("Close:关闭设备");
	}
function OnWaveIn(date,len,devid){
	AddInfo(devid+":音频长度(byte字节):"+len);
	//存储录音文件到服务器
	
}
function OnStartRecord(devid,filename){
	AddInfo(devid+":开始录音:"+filename);
}
function OnEndRecord(devid,filename){
	AddInfo(devid+":结束录音:"+filename);
	//根据录音文件名,存储录音结束时间及录音时长
	
}
//获取录音文件保存路径
function WavePath(){
	var wavePath = JDComPort1.WavePath();
	alert("录音文件路径:"+wavePath);
	return wavePath;
}

</script>
<script type="text/javascript">
JDComPort1.attachEvent("OnClose",OnClose); //关闭设备事件    
JDComPort1.attachEvent("OnKeyPress",OnKeyPress);//按键  振铃  摘记  挂机事件     
JDComPort1.attachEvent("OnRead",OnRead);//来电显示  开始录音事件
JDComPort1.attachEvent("OnOpen",OnOpen);//打开设备事件
JDComPort1.attachEvent("OnWaveIn",OnWaveIn);//获取录音数据事件
JDComPort1.attachEvent("OnStartRecord",OnStartRecord);//开始录音
JDComPort1.attachEvent("OnEndRecord",OnEndRecord); //结束录音

</script>
</body>


</html>